<template>
  <el-container>
    <el-header class="header">
      <div v-if="!loginStatus">
        <el-button type="primary" @click="login" class="login-button">登录</el-button>
      </div>
      <div v-if="loginStatus" @click="individualCenter">
        <el-dropdown @command="handleCommand">
          <el-avatar :src="userAvatar" size="medium" ></el-avatar>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="logout">退出登录</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </div>
    </el-header>
  </el-container>
</template>

<script>
import Cookies from "js-cookie";

export default {
  name: "PublicLogin",
  data() {
    return {
      loginStatus: '',
      userAvatar: '',
      permission: -1
    };
  },
  methods: {
    handleCommand(command) {
      if (command === "logout") {
        this.logout();
      }
    },
    logout() {
      this.$confirm('您确定要退出登录吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        Cookies.remove('user');
        this.loginStatus = '';
        this.$message({
          type: 'success',
          message: '已成功退出登录！'
        });
        this.$router.push('/');
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消退出登录'
        });
      });
    },
    login() {
      // 跳转到登录页面或打开登录弹窗
      this.$router.push("/Login");
    },
    isUserLoggedIn() {
      this.loginStatus = Cookies.get('user');
      if (this.loginStatus) {
        let params = {
          token: this.loginStatus
        }
        this.$axios.post('/userinfo/analysis',params).then(res => {
          console.log("---------------------------------------------------------")
          console.log(res.data)
          this.userAvatar = res.data.data.userIcon;
          this.permission = res.data.data.permission;
        })
      }
    },
    individualCenter() {
      // 跳转到登录页面或打开登录弹窗
      if (this.permission === 2) {
        this.$router.push("/UserCenter");
        return;
      }
      this.$router.push("/MangerHome")
    },
  },
  created() {
    this.isUserLoggedIn()
  }
}
</script>

<style scoped>

</style>